<template>
    <div>
        <!-- 头部 -->
        <Header @getHeader="getHeader"></Header>
        <!-- 正在进行中/已经完成 -->
        <Panl 
            @endToRun="endToRun"
            @runToEnd="runToEnd"
            :runings="runings" 
            :ends="ends"></Panl>

    </div>
</template>
<script>
import Header from "./header.vue"
import Panl from "./Panl.vue"
export default {
    data(){
        return{
            //正在进行中
            runings:[],
            //已完成的
            ends:[],
        }
    },
    methods:{
        //从正在进行中到已经完成
        runToEnd(index){
            console.log(index)
            const item = this.runings.splice(index,1)
            //插入到ends
            this.ends.push(item[0]);
        },
        //从已经完成到正在进行中
        endToRun(index){
            console.log(index)
            const item = this.ends.splice(index,1)
            this.runings.push(item[0])
        },
        //接收头部输入的内容
        getHeader(value){
            console.log(value);
            this.runings.push(value)
        }
    },
    
    components:{Header,Panl}
}
</script>